<template>
	<div>
		<h2>教学安排</h2>
		<hr>
		<div style="display:flex;justify-content: space-between;">
			<div style="width: 70%;border: 1px solid red;">
				<h3 style="text-align: center;">已安排的教学任务</h3>
				<table border="1" style="width: 100%;height: 75%;">
					<tr v-for="x in tasks">
						<th>{{ x.user.uid }}</th>
						<th>{{ x.user.uname }}</th>
						<th>{{ x.clz.clzno }}</th>
						<th>{{ x.clz.clzname }}</th>
						<th>{{ x.course.cno }}</th>
						<th>{{ x.course.cname }}</th>
						<th><button @click="del(x.kid)">删除</button></th>
					</tr>
				</table>
			</div>

			<div style="width: 32%; border: 1px solid #FFA500; padding: 10px;">
				<h3 style="text-align: center;">添加新的课程安排</h3>
				<div style="display: flex; flex-direction: column; gap: 10px;">
					<div style="display: flex; align-items: center;">
						教师：<select v-model="task.user.uid" style="margin-left: 10px;">
							<option v-for="x, idx in teas" v-bind:value="x.uid">
								{{ x.uname }}
							</option>
						</select>
					</div>
					<div style="display: flex; align-items: center;">
						班级：<select v-model="task.clz.clzno" style="margin-left: 10px;">
							<option v-for="x, idx in clzs" v-bind:value="x.clzno">
								{{ x.clzname }}
							</option>
						</select>
					</div>
					<div style="display: flex; align-items: center;">
						课程：<select v-model="task.course.con" style="margin-left: 10px;">
							<option v-for="x, idx in courses" v-bind:value="x.cno">
								{{ x.cname }}
							</option>
						</select>
					</div>
					<button v-on:click="add()" style="align-self: center;">添加</button>
				</div>
			</div>
		</div>

	</div>
</template>

<script setup>
import axios from 'axios';
</script>
<script>
export default {
	data() {
		return {
			tasks:[{user:{uid:'',uname:''},clz:{clzno:'',clzname:''},course:{con:'',cname:''}}],
			// tasks: [],
			task: { kid: 0, user: { uid: "" }, clz: {}, course: {} },
			teas: [],
			clzs: [],
			courses: [],
			token: ""
		}
	},
	methods: {

add() {
  console.log("1111");
  var that = this;

  // 检查必填字段是否为空
  if (that.task.user.uid == undefined || that.task.clz.clzno == undefined || that.task.course.con == undefined) {
    alert("添加不允许为空");
    return;
  }

  console.log(that.task);
  let vdta = that.task; // 数据
  console.log(vdta);

  // 发送 POST 请求
  this.$axios.post(this.$ip + "/api/adm/task/add", vdta, { headers: { 'Authorization': that.token } })
    .then(function (resp) {
      console.log("响应数据:", resp.data); // 添加分号
      if (resp.data.success) { // 假设后端返回的 success 字段表示成功
        that.tasks = resp.data.data;
        console.log("任务列表更新:", resp.data.data); // 添加分号
        alert("任务添加成功"); // 添加分号
      } else {
        alert("任务添加失败: " + resp.data.message); // 添加分号
      }
    })
    .catch(function (error) {
      console.error("请求失败:", error); // 添加分号
      if (error.response) {
        // 请求已发出，但服务器响应的状态码不在 2xx 范围内
        alert("服务器错误: " + error.response.data.message); // 添加分号
      } else if (error.request) {
        // 请求已发出，但没有收到响应
        alert("请求超时或服务器未响应"); // 添加分号
      } else {
        // 在设置请求时发生了一些事情，触发了错误
        alert("请求配置错误: " + error.message); // 添加分号
      }
    });

		// 添加
		// add() {

		// 	console.log("1111")
		// 	var that = this
		// 	if (that.task.user.uid == undefined || that.task.clz.clzno == undefined ||
		// 		that.task.course.con == undefined) {
		// 		alert("添加不允许为空")
		// 		return;
		// 	}

		// 	console.log(that.task)
		// 	let vdta = that.task;//数据
		// 	console.log(vdta)
		// 	this.$axios.post(this.$ip + "/api/adm/task/add", this.task, { headers: { 'Authorization': that.token } }).then(function (resp) {
		// 		that.tasks = resp.data.data
		// 		console.log(resp.data.data)
		// 	})
		//=====================================================
		// console.log(that.task.user.uid)

		// let fd = new FormData();
		// fd.append("tasks.user.uid", that.task.user.uid);
		// fd.append("tasks.clz.clzno", that.task.clz.clzno);
		// fd.append("tasks.course.con", that.task.course.con);
		// console.log("1111111")

		// console.log(that.token)


		// that.$axios.post(`${this.$ip}/api/adm/task/add`, fd, { headers: { 'Authorization': that.token,'content-type':'data
		//  } }).then(function (resp) {
		// 	that.tasks = resp.data.data
		// 	console.log(resp.data.data)
		// })



	},
	del(kid) {
		var that = this
		this.$axios.get(this.$ip + "/api/adm/task/del/" + kid, { headers: { 'Authorization': that.token } }).then(function (resp) {
			that.tasks = resp.data.data
			console.log(resp.data)
		})
	}
},
mounted() {
	var that = this
	this.token = window.localStorage.getItem("token")
	this.$axios.get(this.$ip + "/api/adm/task/findAll", { headers: { 'Authorization': that.token } }).then(function (resp) {
		that.tasks = resp.data.data
		console.log(resp.data.data)
	})
	this.$axios.get(this.$ip + "/api/adm/tea/findAll", { headers: { 'Authorization': that.token } }).then(function (resp) {
		that.teas = resp.data.data
		console.log(resp.data.data)
	})
	this.$axios.get(this.$ip + "/api/public/getClzs").then(function (resp) {
		that.clzs = resp.data.data
		console.log(resp.data.data)
	})
	this.$axios.get(this.$ip + "/api/public/getCourses").then(function (resp) {
		that.courses = resp.data.data
		console.log(resp.data.data)
	})
}
}
</script>

<style></style>
